import Vue from 'vue';
import Vuex from 'vuex';
import todoHeader from "./modules/todoHeader"
import todoMain from "./modules/todoMain"
import todoFooter from "./modules/todoFooter"
import createPersistedState from "vuex-persistedstate";
Vue.use(Vuex)

export default new Vuex.Store({
    modules: {
        todoHeader,
        todoMain,
        todoFooter
    },
    getters: {
        todiList(state) {
            return state.todoMain.todiList
        },
        showList(state, getters) {
            console.log("state.todoFooter.isSel",state.todoFooter.isSel)
 
            if (state.todoFooter.isSel == "all") {
                return getters.todiList
            } else if (state.todoFooter.isSel == "no") {
                return getters.todiList.filter(item => !item.idDone)
            } else if(state.todoFooter.isSel == "yes"){
                return getters.todiList.filter(item => item.idDone)
            }
        }
    },
    plugins: [createPersistedState({
        key:"my-vueX"
    })]
})